<nz-spin [nzTip]="'正在导入请等待...'" [nzSize]="'large'" [nzSpinning]="isSpinning">

    <nz-collapseset nzAccordion>
      <nz-collapse [nzTitle]="'曳引与强制驱动电梯检查项目'" [nzActive]="true">
          <nz-table #nzTable [nzDataSource]="yeItemList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="productdisplayDataChange($event)">
              <thead nz-thead>
                <tr>
                  <th nz-th [nzCheckbox]="true">
                    <label nz-checkbox [(ngModel)]="productallChecked" [nzIndeterminate]="productindeterminate" (ngModelChange)="productcheckAll($event)">
                    </label>
                  </th>
                  <th nz-th>
                    <span>维护保养项目（内容）</span>
                  </th>
                  <th nz-th>
                    <span>维护保养基本要求</span>
                  </th>
                </tr>
              </thead>
              <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let data of yeItemList">
                  <td nz-td [nzCheckbox]="true">
                    <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="productrefreshStatus($event)">
                    </label>
                  </td>
                  <td nz-td>{{data.itemContent}}</td>
                  <td nz-td>{{data.ext2}}</td>
                </tr>
              </tbody>
            </nz-table>
      </nz-collapse>



      <nz-collapse [nzTitle]="'液压驱动电梯检查项目'" [nzActive]="false">
          <nz-table #nzTable [nzDataSource]="hydraulicList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="useddisplayDataChange($event)">
              <thead nz-thead>
                <tr>
                  <th nz-th [nzCheckbox]="true">
                    <label nz-checkbox [(ngModel)]="usedallChecked" [nzIndeterminate]="usedindeterminate" (ngModelChange)="usedcheckAll($event)">
                    </label>
                  </th>
                  <th nz-th>
                    <span>维护保养项目（内容）</span>
                  </th>
                  <th nz-th>
                    <span>维护保养基本要求</span>
                  </th>
                </tr>
              </thead>
              <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let data of hydraulicList">
                  <td nz-td [nzCheckbox]="true">
                    <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="usedrefreshStatus($event)">
                    </label>
                  </td>
                  <td nz-td>{{data.itemContent}}</td>
                  <td nz-td>{{data.ext2}}</td>
                </tr>
              </tbody>
            </nz-table>
      </nz-collapse>


      <nz-collapse [nzTitle]="'杂物电梯检查项目'" [nzActive]="false">
          <nz-table #nzTable [nzDataSource]="variaList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="elevatordisplayDataChange($event)">
              <thead nz-thead>
                <tr>
                  <th nz-th [nzCheckbox]="true">
                    <label nz-checkbox [(ngModel)]="elevatorallChecked" [nzIndeterminate]="elevatorindeterminate" (ngModelChange)="elevatorcheckAll($event)">
                    </label>
                  </th>
                  <th nz-th>
                    <span>维护保养项目（内容）</span>
                  </th>
                  <th nz-th>
                    <span>维护保养基本要求</span>
                  </th>
                </tr>
              </thead>
              <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let data of variaList">
                  <td nz-td [nzCheckbox]="true">
                    <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="elevatorrefreshStatus($event)">
                    </label>
                  </td>
                  <td nz-td>{{data.itemContent}}</td>
                  <td nz-td>{{data.ext2}}</td>
                </tr>
              </tbody>
            </nz-table>
      </nz-collapse>

      <nz-collapse [nzTitle]="'自动扶梯与自动人行道'" [nzActive]="false">
          <nz-table #nzTable [nzDataSource]="automaticList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="selfdisplayDataChange($event)">
              <thead nz-thead>
                <tr>
                  <th nz-th [nzCheckbox]="true">
                    <label nz-checkbox [(ngModel)]="selfallChecked" [nzIndeterminate]="selfindeterminate" (ngModelChange)="selfcheckAll($event)">
                    </label>
                  </th>
                  <th nz-th>
                    <span>维护保养项目（内容）</span>
                  </th>
                  <th nz-th>
                    <span>维护保养基本要求</span>
                  </th>
                </tr>
              </thead>
              <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let data of automaticList">
                  <td nz-td [nzCheckbox]="true">
                    <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="selfrefreshStatus($event)">
                    </label>
                  </td>
                  <td nz-td>{{data.itemContent}}</td>
                  <td nz-td>{{data.ext2}}</td>
                </tr>
              </tbody>
            </nz-table>
      </nz-collapse>

      <nz-collapse [nzTitle]="'自定义检查项目'" [nzActive]="false">
        <ul nz-menu [nzMode]="'horizontal'">
          <li nz-menu-item (click)="deleteItem()">
            <i class="anticon anticon-delete"></i>删除
          </li>
        </ul>
        <nz-table #nzTable [nzDataSource]="customList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="customdisplayDataChange($event)">
          <thead nz-thead>
          <tr>
            <th nz-th [nzCheckbox]="true">
              <label nz-checkbox [(ngModel)]="customallChecked" [nzIndeterminate]="customindeterminate" (ngModelChange)="customcheckAll($event)">
              </label>
            </th>
            <th nz-th>
              <span>维护保养项目（内容）</span>
            </th>
            <th nz-th>
              <span>维护保养基本要求</span>
            </th>
          </tr>
          </thead>
          <tbody nz-tbody>
          <tr nz-tbody-tr *ngFor="let data of customList">
            <td nz-td [nzCheckbox]="true">
              <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="customrefreshStatus($event)">
              </label>
            </td>
            <td nz-td>{{data.customName}}</td>
            <td nz-td>维护保养</td>
            <td hidden nz-td>{{data.id}}</td>
          </tr>
          </tbody>
        </nz-table>


        <form style="margin-top: 20px;" nz-form [formGroup]="validateForm" (ngSubmit)="_submitForm()">
          <div nz-form-item nz-row *ngFor="let control of controlArray;let i = index">
            <div nz-form-label nz-col [nzSpan]="4" *ngIf="i==0">
              <label [attr.for]="control.controlInstance">请输入检查内容</label>
            </div>
            <div nz-form-control nz-col [nzSpan]="20" [nzOffset]="i==0?0:4">
              <nz-input
                style="width: 60%; margin-right:8px;"
                [nzSize]="'large'"
                [nzPlaceHolder]="'请输入检查内容'"
                [formControlName]="control.controlInstance"
                [nzId]="control.id">
              </nz-input>
              <i class="anticon anticon-minus-circle-o dynamic-delete-button" (click)="removeField(control,$event)"></i>
              <div nz-form-explain
                   *ngIf="getFormControl(control.controlInstance)?.dirty&&getFormControl(control.controlInstance)?.hasError('required')">
                请先填写自定义检查项
              </div>
            </div>
          </div>
          <div nz-form-item nz-row>
            <div nz-form-control nz-col [nzSpan]="20" [nzOffset]="4">
              <button nz-button [nzType]="'dashed'" [nzSize]="'large'" style="width:60%" (click)="addField($event)">
                <i class="anticon anticon-plus"></i>
                <span>添加检查内容</span>
              </button>
            </div>
          </div>

          <div nz-form-item nz-row>
            <div nz-form-control nz-col [nzSpan]="20" [nzOffset]="4">
              <button nz-button [nzType]="'primary'" [nzSize]="'large'">提交</button>
            </div>
          </div>
        </form>

     </nz-collapse>
    </nz-collapseset>


    <form nz-form>
      <div nz-form-item nz-row style="margin-bottom:8px;margin-top:20px;">
        <div nz-form-control nz-col [nzSpan]="2" [nzOffset]="8">
          <button nz-button [nzSize]="'large'" (click)="cancel($event)" [nzType]="'default'">取消</button>
        </div>
        <div nz-form-control nz-col [nzSpan]="2" [nzOffset]="4">
          <button nz-button [nzSize]="'large'" (click)="submitForm($event)" [nzType]="'primary'">确定</button>
        </div>
      </div>
    </form>


</nz-spin>
